<script>
import WechatJSSDK from 'wechat-jssdk/dist/client.umd'
import { mapGetters } from 'vuex'
export default {
  name: 'WechatSdk',
  components: {
    WechatJSSDK
  },
  props: {
    config: {
      type: Object
    }
  },
  data () {
    return {
      wechatConfig2: null
    }
  },
  computed: {
    ...mapGetters(['shareData']),
    wechatConfig () {
      return Object.assign(
        {
          appId: 'xxx',
          nonceStr: 'xxx',
          signature: 'xxx',
          timestamp: 'xxx',
          // 下面为可选参数
          debug: true, // 开启 debug 模式
          jsApiList: ['updateAppMessageShareData', 'onMenuShareTimeline', 'onMenuShareAppMessage'], // 设置所有想要使用的微信jsapi列表, 默认值为 ['onMenuShareTimeline', 'onMenuShareAppMessage']，分享到朋友圈及聊天记录
          customUrl: 'http://res.wx.qq.com/open/js/jweixin-1.6.0.js' // 自定义微信js链接
        },
        this.config
      )
    }
  },
  watch: {
    shareData (val) {
      this.share(val)
    }
  },
  methods: {
    share (data) {
      console.group('Wechat JSSDK')
      console.log('shareing')
      console.log('shareing data', data)

      console.log(this.wechatConfig)
      const wechatObj = new WechatJSSDK(this.wechatConfig)
      // console.log(wechatObj)
      wechatObj
        .initialize()
        .then(wx => {
          console.log('[wx]', wx)
          console.log('[wx.wx]', wx.wx)

          wx.callWechatApi('updateAppMessageShareData', {
            type: 'link',
            title: 'title',
            link: location.href,
            imgUrl: '/logo.png',
            desc: 'description',
            success: function () {},
            cancel: function () {}
          })
          // wx.shareOnChat({
          //   type: 'link',
          //   title: 'title',
          //   link: location.href,
          //   imgUrl: '/logo.png',
          //   desc: 'description',
          //   success: function () {
          //     console.log('success')
          //   },
          //   cancel: function () {
          //     console.log('cancel')
          //   }
          // })

          wx.wx.ready(() => {
            console.log('ready')
          })
        // set up your share info, "w" is the same instance as "wechatObj"
        })
        .catch(err => {
          console.error('[err]', err)
        })

      // 自定义分享到聊天窗口
      // 内部调用 `wechatObj.callWechatApi('onMenuShareAppMessage', {...})`， 语法糖而已
      // wechatObj.shareOnChat({
      //   type: 'link',
      //   title: 'title',
      //   link: location.href,
      //   imgUrl: '/logo.png',
      //   desc: 'description',
      //   success: function () {
      //     console.log('success')
      //   },
      //   cancel: function () {
      //     console.log('cancel')
      //   }
      // })
      // wechatObj.callWechatApi('onMenuShareAppMessage', {
      //   type: 'link',
      //   title: 'title',
      //   link: location.href,
      //   imgUrl: '/logo.png',
      //   desc: 'description',
      //   success: function () {},
      //   cancel: function () {}
      // })
      // // 自定义分享到朋友圈
      // // 语法糖
      // wechatObj.shareOnMoment({
      //   type: 'link',
      //   title: 'title',
      //   link: location.href,
      //   imgUrl: '/logo.png'
      // })
      console.groupEnd('Wechat JSSDK')
    }
  }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less" scoped>
.price {
  padding-left: 3px;
  display: inline-flex;
  align-items: baseline;
  &-currency {
    font-size: 80%;
  }
  &-integer {
    font-size: 140%;
    font-weight: normal;
    font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;
  }
  &-decimal {
    font-size: 80%;
    font-family: Avenir-Heavy, PingFang SC, Helvetica Neue, Arial, sans-serif;
    &::before {
      content: ".";
    }
  }
}
</style>
